//spacing, typography
@step--2: var(--step--2);
@step--1: var(--step--1);
@step-0: var(--step-0);
@step-1: var(--step-1);
@step-2: var(--step-2);
@step-3: var(--step-3);
@step-4: var(--step-4);
@step-5: var(--step-5);
@step-6: var(--step-6);
@step-7: var(--step-7);
@step-8: var(--step-8);
@step-9: var(--step-9);
@step-10: var(--step-10);

//media queries
@mobile: ~"(max-width: 480px)";
@tablet: ~"(max-width: 768px)";
@tablet-horiz: ~"(max-width: 1024px)";
@phone-horiz: ~"(max-width:670px)";
@text-width: ~"(max-width: 730px)";
@widthmax: ~"(max-width: 1000000px)";

@vert: ~"(orientation: portrait)";
@lscape: ~"(orientation: lanscape)";

//serif
@hed: "Tiempos Headline Light", Georgia, serif;
@alt-hed: "Tiempos Headline Black", Georgia, serif;
@serif-book: "Tiempos Regular", Georgia, serif;
@serif-bold: "Tiempos Bold", Georgia, serif;
@base-font-size: @step-0;

//sansserif
@sans-light: "National Light", Helvetica, sans-serif;
@sans-book: "National Book", Helvetica, sans-serif;
@sans-med: "National Medium", Helvetica, sans-serif;
@sans-bold: "National Bold", Helvetica, sans-serif;


//colors
@brand: #2CB9BF;
@primary: #388EF4;
@white: #FFFFFF;
@black: #000000;
@text: #222222;
@accent: #60849D;
@off-white: #FCFCFC;
@light-gray: #ECECEC;
@gray: #999999;
@dark-gray: #444444;
@med-gray: #777777;
@red: #CB0024;

// accessibility styles from https://github.com/mike-engel/a11y-css-reset/
/* https://medium.com/@matuzo/writing-css-with-accessibility-in-mind-8514a0007939 */
.visually-hidden() {
  position: absolute;
  white-space: nowrap;
  width: 1px;
  height: 1px;
  overflow: hidden;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  margin: -1px;
}

/* https://www.scottohara.me/blog/2019/01/12/lists-and-safari.html */
.plain-list() {
  list-style: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E");
  padding-left: 0;
}
